<template>
  <div>
    <h1>篮球页</h1>
    <ul>
      <li>
        <router-link to="/basketball/man"> 男子篮球 </router-link>
      </li>
      <li>
        <router-link to="/basketball/woman"> 女子篮球 </router-link>
      </li>
      <button @click="changeShow">随机显示</button>
      <router-view></router-view>
    </ul>
  </div>
</template>
 
<script>
export default {
  components: {},
  data() {
    return {
      arr: ['/basketball/man', '/basketball/woman']
    }
  },
  methods: {
    changeShow() {
      const index = Math.floor(Math.random() * this.arr.length)
      this.$router.push({
        path: this.arr[index]
      })
    }
  }
}
</script>

<style scoped>
a {
  font-size: 22px;
}
li{
  line-height: 22px;
  margin-bottom: 15px;
}
button{
  width: 100px;
  height: 50px;
}
</style>